/**
 * 列表页面通用样式（尽量精简）
 * 用于统一搜索栏、筛选抽屉、操作区、列表项与空态
 */

.list-page {
  min-height: 100vh;
  background: #f5f5f5;
}

.list-search-bar {
  display: flex;
  align-items: center;
  padding: 8px 16px;
  background: #fff;
  border-bottom: 1px solid #eee;
  gap: 8px;
}

.list-search-input {
  flex: 1;
  display: flex;
  align-items: center;
  background: #f8f8f8;
  border-radius: 20px;
  padding: 8px 16px;
  gap: 8px;
}

.list-input { flex: 1; font-size: 14px; color: #333; }
.list-filter-btn { padding: 2px 8px; }

.list-filter-drawer { width: 300px; height: 100vh; background: #fff; display: flex; flex-direction: column; }
.list-filter-header { display: flex; justify-content: space-between; align-items: center; padding: 16px; border-bottom: 1px solid #eee; }
.list-filter-title { font-size: 16px; font-weight: 600; color: #333; }
.list-filter-content { flex: 1; padding: 16px; }
.list-filter-item { margin-bottom: 20px; }
.list-filter-label { display: block; margin-bottom: 8px; font-size: 14px; color: #333; font-weight: 500; }
.list-filter-footer { position: sticky; bottom: 0; display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px; border-top: 1px solid #eee; background: #fff; box-shadow: 0 -2px 8px rgba(0,0,0,.04); z-index: 2; }
.list-filter-footer .btn { padding: 6px 14px; font-size: 14px; border-radius: 6px; }

.list-action-bar { display: flex; gap: 6px; padding: 12px 16px; background: #fff; border-bottom: 1px solid #eee; justify-content: flex-end; }
.btn { display: flex; align-items: center; justify-content: center; gap: 4px; padding: 2px 8px; border-radius: 4px; font-size: 12px; border: none; }
.btn-primary { background: #e6f7ff; color: #007aff; border: 1px solid #91d5ff; }
.btn-default, .btn-reset { background: #f8f8f8; color: #666; border: 1px solid #d9d9d9; }
.btn-confirm { background: #e6f7ff; color: #007aff; border: 1px solid #91d5ff; }

.list-content { background: #fff; }
.list-item { display: flex; align-items: flex-start; padding: 16px; border-bottom: 1px solid #f0f0f0; gap: 12px; }
.list-avatar { width: 40px; height: 40px; border-radius: 20px; background: #f0f8ff; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.list-info { flex: 1; min-width: 0; }
.list-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.list-title { font-size: 16px; font-weight: 600; color: #333; }
.list-subtitle { font-size: 14px; color: #666; }
.status-badge { padding: 2px 8px; border-radius: 10px; font-size: 12px; }
.status-normal { background: #e8f5e8; color: #52c41a; }
.status-disabled { background: #fff2f0; color: #ff4d4f; }
.list-details { display: flex; flex-direction: column; gap: 6px; }
.detail-item { display: flex; align-items: center; gap: 6px; }
.detail-text { font-size: 13px; color: #666; }
.list-actions { display: flex; flex-direction: column; gap: 6px; flex-shrink: 0; }
.action-btn { display: flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 4px; font-size: 12px; border: 1px solid transparent; }
.action-primary { background: #e6f7ff; color: #007aff; border-color: #91d5ff; }
.action-default { background: #f8f8f8; color: #666; border-color: #d9d9d9; }
.action-warning { background: #fff7e6; color: #ff9500; border-color: #ffd591; }
.action-success { background: #f6ffed; color: #34c759; border-color: #b7eb8f; }
.action-danger { background: #fff2f0; color: #ff3b30; border-color: #ffccc7; }
.action-text { font-size: 11px; }

.list-load-more { padding: 20px; text-align: center; }
.list-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 60px 20px; text-align: center; }
.list-empty-text { margin: 16px 0; font-size: 16px; color: #999; }


